<template>
    <div class="footer">
      <div class="bgcolor"></div>
      <div class="footer-logoimg" v-if="footerImg">
        <img :src="footerImg" alt="">
      </div>
      <div class="footer-list">
        <div class="list-item">
          <img src="//img12.360buyimg.com/jrpmobile/jfs/t2971/333/1297567079/898/f2d2e00d/577dc28dNe5138337.png?width=108&height=108" alt="">
          <p>客户端</p>
        </div>
        <div class="list-item">
          <img src="//img12.360buyimg.com/jrpmobile/jfs/t2824/256/2966087355/831/188bfa25/577cf3dcN18aadbf2.png?width=108&height=108" alt="">
          <p>触屏版</p>
        </div>
        <div class="list-item">
          <img src="//img12.360buyimg.com/jrpmobile/jfs/t2920/282/1283157010/1040/23f1430b/577cf3e5N53f740b8.png?width=108&height=108" alt="">
          <p>电脑版</p>
        </div>
      </div>
      <ul class="footer-des">
        <li>Copyright © 2004-2017 京东JD.com 版权所有</li>
        <li>投资有风险，购买需谨慎</li>
        <li>京东金融平台服务协议</li>
        <li>京东金融隐私政策</li>
      </ul>
    </div>
</template>

<script>
export default {
  name: 'Footer',
  props: {
    footerImg: {
      type: String
    }
  }
}
</script>

<style lang="stylus" scoped>
  @import '../../assets/css/varibles.styl'
  @import '../../assets/css/mixins.styl'
  .footer
     background:#f2f2f2
     padding-bottom:1rem
    .bgcolor
      pdTop()
    .footer-logoimg
     img
      width:100%
    .footer-list
      height:2.4rem
      overflow:hidden
      display:flex
      text-align:center
      line-height:.8rem
     .list-item
      box-sizing:border-box
      display:inline-block
      width:33%
      img
       width:1.6rem
       height:1.6rem
       margin-top:.2rem
  .footer-des
   overflow:hidden
   background:#f5f5f5
   margin-top:.24rem
   li
     font-size: .26rem
     line-height:.9rem
     text-align: center
     display: block
     color: #999
     border-top: .02rem solid #ddd;
</style>
